<template>
  <div class="loginerror_page">
    <div class="loginerror_container">
      <img class="loginerror_img"
        src="./emptyState.png"
        alt="">
      <div class="loginerror_title">账号或密码输入错误</div>
      <div class='loginerror_bth'>
        <router-link :to="{ path: '/login'}">返回登录页</router-link>
      </div>
    </div>
  </div>
</template>

<style lang="less">
.loginerror_page {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
}
.loginerror_container {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 144px;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  .loginerror_img {
    float: left;
    margin: 0 32px;
  }
  .loginerror_title {
    float: left;
    margin: 20px auto 40px;
    color: rgba(102, 102, 102, 1);
    font-weight: 400;
    font-size: 16px;
    font-family: PingFangSC-Regular, PingFang SC;
    line-height: 30px;
  }
  .loginerror_bth {
    float: left;
    margin: 0 22px;
    width: 100px;
    height: 30px;
    border: 1px solid @primaryColor;
    border-radius: 2px;
    background: rgba(255, 255, 255, 1);
    text-align: center;
    a {
      color: @primaryColor;
      text-decoration: none;
      font-weight: 400;
      font-size: 14px;
      font-family: PingFangSC-Regular, PingFang SC;
      line-height: 30px;
    }
  }
}
</style>

<script>
export default {
  data() {
    return {}
  },
  methods: {},
  beforeRouteLeave: function(to, from, next) {
    localStorage.removeItem('tokenData')
    next()
  },
  mounted: function() {},
  destroyed() {}
}
</script>
